<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div id="d"></div>
  <div id="dd"></div>
  <p>
    我是文字
    <span>123</span>
  </p>
  <script>
    // innerText 和 innerHTML 的区别
    // 1. innerText 不识别html标签，非标准， 去除空格和换行
    var d = document.getElementById('d');
    d.innerText = '<strong> 今天是：</strong> 2019';
    // 2. innerHTML 识别html标签，w3c标准，保留空格和换行
    var dd = document.getElementById('dd');
    dd.innerHTML = '<strong> 今天是：</strong> 2019';
    // 这两个属性是可读写的，可以获取元素里面的内容
    var p = document.querySelector('p');
    console.log(p.innerText);
    console.log(p.innerHTML);
  </script>
</body>

</html>